<template>
	<view class="introduction-layout" v-if="deceased">
		<view class="info-layout">
			<view class="info-item">姓名：{{ deceased.name }}</view>
			<view class="info-item">性别：{{ sexFormat }}</view>
		</view>
		<view class="info-layout">
			<view class="info-item">墓志铭：{{ deceased.epitaph ? deceased.epitaph : '未填写墓志铭' }}</view>
		</view>
		<view class="title-layout">生命轴线</view>
		<view class="date-layout">
			<text class="date-text left">{{ birthdayFormat }}</text>
			<text class="date-text center">{{ deathDayFormat }}</text>
			<text class="date-text right">{{ todayFormat }}</text>
		</view>
		<view class="divider-layout">
			<view class="circle"></view>
			<view class="line"></view>
			<view class="circle"></view>
			<view class="line"></view>
			<view class="circle"></view>
		</view>
		<view class="event-layout">
			<text class="event-text bold">出生</text>
			<text class="event-text left" style="margin-top: -35.04rpx;">{{ lifeFormat }}</text>
			<text class="event-text center bold">逝世</text>
			<text class="event-text right" style="margin-top: -35.04rpx;">{{ deadFormat }}</text>
			<text class="event-text"></text>
		</view>
		<view class="title-layout">生平事迹</view>
		<view class="story-layout">
			<view class="content-top"></view>
			<view class="content-middle">
				<view class="empty" v-if="dataList.length === 0">未发布生平事迹</view>
				<view class="story-item" v-for="story in dataList" :key="story.id">
					<view class="left-layout">
						<view class="year">{{ story.eventDate ? moment(story.eventDate).year() : '不详' }}</view>
						<view v-if="story.eventDate" class="date">{{ moment(story.eventDate).format('MM-DD') + dateFormat(story.dateType) }}</view>
					</view>
					<view class="circle"></view>
					<view class="right-layout">
						<view class="content">{{ story.content }}</view>
						<view class="photo-layout" v-if="story.pictures && story.pictures.length > 0">
							<view class="photo-item" v-for="(pic, pIndex) in story.pictures" :key="pic.url">
								<image :src="imageUrl + pic.url" @click="preview(story.pictures, pIndex)"></image>
							</view>
						</view>
					</view>
				</view>
			</view>
			<view class="content-bottom"></view>
		</view>
	</view>
</template>

<script>
import mixin from '@/pages/common/mixins/memorial-hall.js';

export default {
	mixins: [mixin],
	dicts: ['sys_user_sex'],
	data() {
		return {
			dataList: []
		};
	},
	props: {
		deceased: {
			type: Object,
			default() {
				return {};
			}
		}
	},
	computed: {
		/* 生日格式化 */
		birthdayFormat() {
			if (this.deceased) {
				if (this.deceased.birthdayType == 0) {
					return '(农)' + this.deceased.birthday;
				} else if (this.deceased.birthdayType == 2) {
					return '(前)' + this.deceased.birthday;
				} else if (this.deceased.birthdayType == 3) {
					return '不详';
				}
				return this.deceased.birthday;
			}
			return '';
		},
		/* 忌日格式化 */
		deathDayFormat() {
			if (this.deceased) {
				if (this.deceased.deathDayType == 0) {
					return '(农)' + this.deceased.deathDay;
				} else if (this.deceased.deathDayType == 2) {
					return '(前)' + this.deceased.deathDay;
				} else if (this.deceased.deathDayType == 3) {
					return '不详';
				}
				return this.deceased.deathDay;
			}
			return '';
		},
		/* 今天格式化 */
		todayFormat() {
			if (this.deceased && this.deceased.dateType == 0) {
				return '(农)' + this.calendar.solar2lunar(this.moment().year(), this.moment().month() + 1, this.moment().date()).lunarDate;
			}
			return this.moment().format('YYYY-MM-DD');
		},
		/* 享年格式化 */
		lifeFormat() {
			if (this.deceased) {
				if (this.deceased.birthdayType == 2 && this.deceased.deathDayType == 2) {
					// 生于公元前，死于公元前
					return '享年' + this.moment(this.deceased.birthday).diff(this.deceased.deathDay, 'years') + '岁';
				} else if (this.deceased.birthdayType == 2 && this.deceased.deathDayType == 1) {
					// 生于公元前，死于公元后
					return '享年' + (this.moment(this.deceased.birthday).get('years') + this.moment(this.deceased.deathDay).get('years')) + '岁';
				} else if (this.deceased.birthdayType == 3 || this.deceased.deathDayType == 3) {
					// 诞辰或者忌日不详
					return '';
				}
				return '享年' + this.moment(this.deceased.deathDay).diff(this.deceased.birthday, 'years') + '岁';
			}
			return '';
		},
		/* 已故格式化 */
		deadFormat() {
			if (this.deceased) {
				let year = 0;
				if (this.deceased.deathDayType == 0) {
					// 农历
					year = this.moment(this.calendar.solar2lunar(this.moment().year(), this.moment().month() + 1, this.moment().date()).lunarDate).diff(
						this.deceased.deathDay,
						'years'
					);
				} else if (this.deceased.deathDayType == 2) {
					// 公元前
					year = this.moment(this.deceased.deathDay).get('year') + this.moment().get('year');
				} else if (this.deceased.deathDayType == 3) {
					// 忌日不详
					return '';
				} else {
					// 公历
					year = this.moment().diff(this.deceased.deathDay, 'years');
				}
				return year > 0 ? '已故' + year + '年' : '溘然长往';
			}
			return '';
		},
		/* 性别格式化 */
		sexFormat() {
			if (this.deceased) {
				let item = this.dict.type.sys_user_sex.find(item => item.value == this.deceased.sex);
				return item ? item.label : '';
			}
			return '';
		}
	},
	methods: {
		/* 加载生平事迹 */
		loadLifeStory() {
			this.$http.get('/life-story/list', { params: { deceasedId: this.deceased.id, status: 1 } }).then(res => {
				if (res.code === 200) {
					this.dataList = res.data;
					setTimeout(() => {
						this.$emit('onLoaded');
					}, 1);
				}
			});
		},
		/* 日期类型格式化 */
		dateFormat(type) {
			switch (type) {
				case 0:
					return '(农历)';
				case 1:
					return '';
				case 2:
					return '(公元前)';
			}
		},
		/* 预览图片 */
		preview(pics, index) {
			let urls = pics.map(item => this.imageUrl + item.url);
			uni.previewImage({
				urls: urls,
				current: index
			});
		}
	},
	watch: {
		deceased: {
			deep: true,
			handler(newV, oldV) {
				if (newV) {
					this.loadLifeStory();
				}
			}
		}
	}
};
</script>

<style lang="scss" scoped>
@import './introduction.scss';
</style>
